<template>
  <div
    class="w-full h-[80px] bg-black/30 backdrop-blur-sm rounded-xl flex items-center justify-center px-4"
  >
    <!-- 左侧图标 -->
    <span
      class="pr-5 opacity-60 transition-transform duration-200 hover:scale-105 hover:opacity-100"
      @click="$emit('click')"
    >
      <img :src="url" style="width: 30px; height: 30px" />
    </span>
    <!-- 右侧文字 -->
    <span>
      <div class="text-[20px]">{{ description }}</div>
    </span>
  </div>
</template>

<script setup lang="ts">
defineProps<{
  title?: string;
  description?: string;
  url?: string;
}>();

defineEmits(["click"]);
</script>

<style scoped lang="scss"></style>
